<template>
	<!-- 底部按钮 -->
	<view class="btn-box" :class="{'fixed':fixed}" :style="{backgroundColor:bgColor}">
		<slot></slot>
	</view>
</template>

<script>
	export default {
		name:'cu-buttom-wrap',
		props: {
			fixed: {
				default: true,
				type: Boolean
			},
			bgColor:{
				default:'transparent',
				type:String
			}
		},
		data() {
			return {}
		},
		methods: {
			
		}
	}
</script>
<style scoped lang="scss">
	.fixed {
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 9;
	}
	.btn-box {
		width: 100%;
		display: flex;
		justify-content: center;
		padding: 20rpx 16rpx;
		padding-bottom: calc(20rpx + constant(safe-area-inset-bottom));
		padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
		z-index: 2;
		
		::v-deep button {
			width: 100%;
			height: 88rpx;
			color: #fff;
			background-color: #68B0FC;
			border-radius: 8rpx;
			text-align: center;
			line-height: 88rpx;
			font-size: 34rpx;
			margin: 0 16rpx;
		}
		
	}
</style>
